<template>



    <el-button @click="dialogVisible=true">
         open dialog
    </el-button>

    <el-dialog
            v-model="dialogVisible"
            title="Tips"
            width="30%"

    >
        <span>This is a message</span>
        <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">Cancel</el-button>
        <el-button type="primary" @click="dialogVisible = false">
          Confirm
        </el-button>
      </span>
        </template>
    </el-dialog>


</template>

<script>
    /**
     * 模态窗体
     * */

    export default {
        name: "Dialog",
        data(){
            return {
                dialogVisible:false
            }
        }
    }
</script>

<style scoped>

</style>